
// 这里是 App子模块

export default {
    // 命名空间 : 推荐加上
    /* 
     好处：1. 避免 多个子模块有相同名字的 getters，mutations，actions的冲突
     坏处： 1. 组件使用时，需要加上具体的子模块 的命名空间名字（模块名）
                    getter: xx模块名/xxgetter
                    mutation: xx模块名/xxxxmutation
                    action: xx模块名/xxxaction

            辅助函数也有变化
            1. mapState(['appName'])   => mapState('模块名字',['appName'])
            2. mapGetters(['xxxgetters'])   => mapGetters('模块名字',['xxxgetters'])
            3. mapMutations(['xxmutations'])   => mapMutations('模块名字',['xxmutations'])
            4. mapActions(['xxxactions'])   => mapActions('模块名字',['xxxactions'])


    */ 
    namespaced:true,  //命名空间

    state(){
        return {
            appName:'app子模块',
            title:'我是app的title'
        }
    },
    getters:{
        appNameLength(state){
            return state.appName.length;
        }
    },

    mutations:{
        // 修改appName
        changeAppName(state,payload){
            console.log('app - changeAppName');
            state.appName  = payload;
        }
    },

    actions:{
        // asyncChangeName(context,payload){
        //     setTimeout(()=>{
        //         context.commit('changeAppName',payload)
        //     },2000)
        // }
        // 异步修改appName   解构 commit
        asyncChangeName({commit},payload){
            setTimeout(()=>{ // payload最终会传递到mutations里
                commit('changeAppName',payload)
            },2000)
        }
    }
}
